// Google Map Plugin UI Helper
// - depends on jQuery 1.2.6, jQuery UI plugin 1.6, and Google Maps API

var map;
var listener_onclick = null;
var user_markers = {};
var query_markers = {};
var icon_blue;
var gtext = new Array();

try {
	switch(i18n) {
		case "zh-TW":
			gtext[0] = '地圖搜尋結果';
			gtext[1] = '固定記錄器';
			gtext[2] = '關閉';
			gtext[3] = '標題';
			gtext[4] = '內容';
			gtext[5] = '取消紀錄器';
			gtext[6] = '太多記錄器(最多: 20 個)!'
			gtext[7] = '編輯';
			gtext[8] = '編輯器無法使用此功能。';
		break;
		case "zh-CN":
			gtext[0] = '地图搜寻结果';
			gtext[1] = '固定记录器';
			gtext[2] = '关闭';
			gtext[3] = '标题';
			gtext[4] = '内容';
			gtext[5] = '取消纪录器';
			gtext[6] = '太多记录器(最多: 20 个)!'
			gtext[7] = '编辑';
			gtext[8] = '编辑器无法使用此功能。';
		break;
		default:
			gtext[0] = '검색 결과가 없습니다.';
			gtext[1] = '마커 고정시키기';
			gtext[2] = '닫기';
			gtext[3] = '제목';
			gtext[4] = '설명';
			gtext[5] = '삭제하기';
			gtext[6] = 'Too many markers(MAX: 20)!';
			gtext[7] = 'Click to edit';
			gtext[8] = 'The editor is not accessible.';
		break;
	}
} catch(err) {
	gtext[0] = '검색 결과가 없습니다.';
	gtext[1] = '마커 고정시키기';
	gtext[2] = '닫기';
	gtext[3] = '제목';
	gtext[4] = '설명';
	gtext[5] = '삭제하기';
	gtext[6] = 'Too many markers(MAX: 20)!';
	gtext[7] = 'Click to edit';
	gtext[8] = 'The editor is not accessible.';
}

$(function() {
	initializeMap();
	var container = $(map.getContainer());
	container
		.resizable({
			minWidth:300, maxWidth:800,
			minHeight:200, maxHeight:800,
			handles:'e,s,w,se,sw'
		})
		.bind('resize', function(ev) {
			map.checkResize();
			$('#inputWidth').val(container.width());
			$('#inputHeight').val(container.height());
		})
		.bind('mousewheel', function(ev) { ev.stopPropagation(); });
	$('#toggleMarkerAddingMode')
		.removeClass('toggled')
		.click(function(ev) {
			$(ev.target).toggleClass('toggled');
			if ($(ev.target).hasClass('toggled')) {
				listener_onclick = GEvent.addListener(map, 'click', GMap_onClick);
			} else {
				GEvent.removeListener(listener_onclick);
			}
		});
	$('#queryLocation').click(queryLocation);
	$('#inputQuery').bind('keypress', function(ev) { if (ev.which == 13) queryLocation(); });
	$('#applyBasicSettings').click(function() {
		var w = $('#inputWidth').val(), h = $('#inputHeight').val();
		container.width(w).height(h);
	});
	$('#doInsert').click(function() {
		if (!map)
			return;
		var editor = window.opener.editor;
		if (!editor) {
			alert(gtext[8]);
			return;
		}
		var options = {};
		var center = map.getCenter();
		options.center = {latitude: center.lat(), longitude: center.lng()};
		options.zoom = map.getZoom();
		options.width = container.width();
		options.height = container.height();
		options.type = getMapTypeStr();
		var compact_user_markers = new Array();
		var i = 0, id = '';
		for (id in user_markers) {
			compact_user_markers[i] = {
				'title': user_markers[id].title,
				'desc': user_markers[id].desc,
				'lat': user_markers[id].marker.getLatLng().lat(),
				'lng': user_markers[id].marker.getLatLng().lng()
			};
			i++;
		}
		options.user_markers = compact_user_markers;
		editor.command('Raw', '[##_GoogleMap|' + $.toJSON(options) + '|_##]');
		self.close();
	});
	//accordion = new Accordion($$('h2'), $$('.accordion-elem'));
	
	icon_blue = new GIcon(G_DEFAULT_ICON, pluginURL + '/images/marker_blue.png');
});

function queryLocation() {
	if (!geocoder)
		geocoder = new GClientGeocoder();
	var q = $('#inputQuery').val();
	closeQueryResult();
	geocoder.getLocations(q, function(response) {
		if (!response || response.Status.code != 200) {
			$('<div id="queryResult">'+gtext[0]+'</div>').insertAfter('#GoogleMapPreview');
		} else {
			$('<div id="queryResult"><ol></ol></div>').insertAfter('#GoogleMapPreview');
			for (var i = 0; i < response.Placemark.length; i++) {
				var place = response.Placemark[i];
				var point = new GLatLng(place.Point.coordinates[1], place.Point.coordinates[0]);
				var id = 'qm' + (new Date).valueOf() + (Math.ceil(Math.random()*90)+10);
				$('<li><a href="#" onclick="map.panTo(new GLatLng('+point.lat()+','+point.lng()+'))">'+place.address+'</a></li>').appendTo('#queryResult ol');
				map.setCenter(point);
				map.setZoom(17);
				var marker = new GMarker(point, {'title': '['+(i+1)+'] ' + place.address, 'icon': icon_blue});
				marker.bindInfoWindowHtml('<div class="queryMarkerInfo"><p><address>'+place.address+'</address></p><p><a href="#" onclick="convertToUserMarker(\''+id+'\')">'+gtext[1]+'</a></p></div>');
				map.addOverlay(marker);
				query_markers[id] = {'marker': marker, 'id': id, 'address': place.address, 'query': q};
			}
		}
		var pos = $(map.getContainer()).offset();
		$('<div style="text-align:right"><a href="#" onclick="closeQueryResult();return false;">'+gtext[2]+'</a></div>').appendTo('#queryResult');
		$('#queryResult').css({top:(pos.top + 20)+'px', left:(pos.left + 60)+'px'}).fadeIn(400).fadeTo(200, 0.8);
	});
}

function closeQueryResult() {
	$('#queryResult').remove();
	for (id in query_markers) {
		map.removeOverlay(query_markers[id].marker);
	}
	query_markers = {};
}

function convertToUserMarker(id) {
	var um = GMap_onClick(null, query_markers[id].marker.getLatLng(), null);
	map.removeOverlay(query_markers[id].marker);
	um.title = query_markers[id].query;
	um.desc = query_markers[id].address;
	delete query_markers[id];
}

function getMapTypeStr() {
	switch (map.getCurrentMapType()) {
	case G_PHYSICAL_MAP:
		return 'G_PHYSICAL_MAP';
	case G_SATELLITE_MAP:
		return 'G_SATELLITE_MAP';
	case G_HYBRID_MAP:
		return 'G_HYBRID_MAP';
	case G_NORMAL_MAP:
	default:
		return 'G_NORMAL_MAP';
	}
}

function findUserMarker(marker) {
	var id;
	for (id in user_markers) {
		if (user_markers[id].marker == marker)
			return user_markers[id];
	}
	return null;
}

function findUserMarkerById(id) {
	var i;
	try {
		return user_markers[id];
	} catch (e) {
		return null;
	}
}

function removeUserMarker(id) {
	map.removeOverlay(user_markers[id].marker);
	delete user_markers[id];
}

function GMap_onClick(overlay, latlng, overlaylatlng) {
	if (overlay == null) { // when empty area is clicked
		if (user_markers.length == 20) {
			alert(gtext[6]);
			return;
		}
		var marker = new GMarker(latlng, {'clickable': true, 'draggable': true, 'bouncy': true, 'title': gtext[7]});
		var id = 'um' + (new Date).valueOf() + (Math.ceil(Math.random()*90)+10);
		GEvent.addListener(marker, 'click', GMarker_onClick);
		GEvent.addListener(marker, 'infowindowbeforeclose', function() {
			user_markers[id].title = $('#info_title').val();
			user_markers[id].desc = $('#info_desc').val();
		});
		user_markers[id] = {'marker': marker, 'title': '', 'desc': '', 'id': id};
		map.addOverlay(marker);
		return user_markers[id];
	}
}

function GMarker_onClick(latlng) {
	var um = findUserMarker(this);
	var form = '<div class="GMapInfo">';
	form += '<p><label for="info_title">'+gtext[3]+' : </label><input id="info_title" type="text" value="'+um.title+'" /></p>';
	form += '<p><label for="info_desc">'+gtext[4]+' : </label><textarea id="info_desc" rows="3" cols="30">'+um.desc+'</textarea></p>';
	form += '<div style="text-align:right"><a href="javascript:void(0);" onclick="removeUserMarker(\''+um.id+'\');">'+gtext[5]+'</div></div>';
	this.openInfoWindowHtml(form);
}